<template>
  <div class="home df fdc">
    <Header ></Header>
    <div class="banner"></div>
    <div class="main">
      <div class="banner">
        <div class="img-box">
          <img src="https://cdn12.mei.com/category/20200422/b79c512e75fcbb05d59f2ae2055be883d4fa53a986efd91b.jpg@1800w_524h_2e_80q" alt="">
        </div>
      </div>
      <div class="containner">
        <div class="content">
          <div class="list" v-for="(item,index) in homeData" :key="index">
            <h3 class="title">
              <span>[</span>
              <span>{{item.name}}</span>
              <span>]</span>
            </h3>
            <ul class="the-box df">
              <CategoryItem v-for="dataObj in item.events" :key="dataObj.eventId" :data="dataObj"></CategoryItem>
            </ul>
        </div>
      </div>
      </div>
    </div>
    <Footer></Footer>
  </div>
</template>

<script src="./Home.js"></script>

<style lang="scss">
@import './Home.scss';
</style>
